<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>页面切换</title>
</head>

<body>
   <div>

   </div>
   <script>
    //页面切换时，视图不可见，浏览器默认最少一秒运行一次
    function count(){
        let n=0;
        const timer=setInterval(()=>{
            n++;
            console.log(n);
            if(n>200){
                clearInterval(timer)
            }
        },10)
    }
    count()

    //视图切走/切回都会监听此事件
    document.addEventListener('visibilitychange',()=>{
        if(document.hidden){
            console.log('first visibilitychange');
        }
    })
   </script>
</body>
</html>